<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/1.2.1/axios.js"></script>

    <script src="./node_modules/nprogress/nprogress.js"></script>
    <link rel="stylesheet" href="./node_modules/nprogress/nprogress.css" />
</head>

<body>
    <script>
        // console.log(axios);

        // axios('http://localhost:3000/movies').then(({data})=>{
        //     console.log(data);
        // });

        // console.log(NProgress.start);

        // 请求拦截器 - 参数 ：配置对象
        axios.interceptors.request.use(config => {
            // console.log(config);

            // 任务：修改补充 配置对象信息
            config.headers.vip = 999;

            // 执行时机 划分很明确 ! 可以加进度条
            // 显示进度条
            NProgress.start();


            // 必须返回 config对象
            return config;
        });

        // 响应拦截器
        axios.interceptors.response.use(res=>{
            
            // console.log(res);

            // 执行时机 -  关闭进度条
            NProgress.done();

            // 可以将得到的数据结构调整并返回

            // 必须返回结果对象
            return res.data;
        },rea=>{
            // 关闭进度条
            NProgress.done();

            // console.log("响应拦截器失败");

            //错误的统一提示处理

            // console.log("抱歉，请求失败");

            return "抱歉，请求失败"+rea.message;

            // throw rea;
        });


        axios('http://localhost:3000/movies').then(val => {
            console.log(val);
        });




    </script>
</body>

</html>